---
title: v15
description: How to migrate to Orbit 15.0.0
redirect_from:
  - /migration-guides/v15/
---

# Orbit Migration Guide v15

This migration guide focuses on the process of migrating from Orbit v14 to v15.0, as some breaking changes were introduced.
With this guide, we aim to walk through all the breaking changes and how they can be addressed, allowing the migration to be smoother and effortlessly.

This version marks the removal of `styled-components`. The whole styling of Orbit components is now done using Tailwind exclusively. This also means that our support for `styled-components` related issues is now finished.

## Breaking changes

### OrbitProvider changes

The `OrbitProvider` component has changed and no longer includes the `ThemeProvider` from `styled-components`.

**This should not have any impact if you are not using `styled-components` in your project.**

The `useTheme` hook is still available and can be used to access the theme values, as usual.

If you are still using `styled-components` in your project, you will need to wrap your application (and the `OrbitProvider`) with the `ThemeProvider` from `styled-components` and pass it the same `theme` you are passing to `OrbitProvider`.

```jsx
import { ThemeProvider } from "styled-components";
import { OrbitProvider } from "@kiwicom/orbit-components";

const App = () => (
  <ThemeProvider theme={theme}>
    <OrbitProvider theme={theme}>
      <App />
    </OrbitProvider>
  </ThemeProvider>
);
```

### mediaQueries util function removed

The `mediaQueries` function is no longer available. This was a `styled-components` util function that is now no longer expected to be used, as we move away from StyledComponents.
If needed, the tokens and breakpoint values are still accessible via the `getBreakpointWidth` function and the `QUERIES` and `TOKEN` constants.
Check [the documentation](/development/utilities/media-queries/) for more information on how to use these.

If you are still using `styled-components` in your custom components and you need this function we invite you to add the implementation to your project. The implementation can be seen [here](https://github.com/kiwicom/orbit/blob/%40kiwicom/orbit-components%4014.0.0/packages/orbit-components/src/utils/mediaQuery/index.ts#L23).

If you are using tailwind, you can use the [tailwind capabilities for responsive design](https://tailwindcss.com/docs/responsive-design).
The breakpoint prefixes available in Orbit and their values are the ones defined on the [Tailwind classnames documentation page](/foundation/tailwind/classnames/), on the `Screens` filter.

### rtl utils removed

The `rtl` utility functions have been removed. They were used to handle RTL styles in the `styled-components` version of Orbit.

With the removal of `styled-components`, these functions are no longer available through `orbit-components`.

If you are still using `styled-components` in your project and need these functions, you can add the implementation to your project. The implementation and documentation can be seen [here](https://github.com/kiwicom/orbit/tree/@kiwicom/orbit-components@14.0.0/packages/orbit-components/src/utils/rtl).

If you are using tailwind, check the [Tailwind documentation](https://tailwindcss.com/docs/hover-focus-and-other-states#rtl-support) for instructions on how to achieve styles exclusively for RTL or LTR.
